<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的第一个实训网页</title>
<link href="my_practice.css" rel="stylesheet" />
</head>
<body>

    <div id="wrapper" >

        <div id="header">
            <p id="ambitious" >AMBITIOUS</p>
            <div id="nav" class="red_boder">
                <ul>
                    <li><a href="#">link1</a></li>
                    <li><a href="#">link2</a></li>
                    <li><a href="#">link3</a></li>
                    <li><a href="#">link4</a></li>
                </ul>
            </div>
        </div>
        
        <div id="middle" class="red_boder">
            <img id="ambitios_img" src="ambitios_pic1.png"/>
            <h1>women prefer</h1>
            <h1>pastel colored flowers</h1>
            <p>Flowers were used to signal meanings in the time when social meetings between men and women was difficult. Lilies make people think of life. Red roses make people think of love, beauty, and passion.</p>
            <a href="#"><img src="ambitios_footer_button.png" alt="button" width="199" height="62" class="button"></a> 

        </div>


        <div id="content">
            <div id="box1">
                <h2>wide range of header sliders</h2>

                
                <div>

                    <p>We already have 3 absolutely different sliders, such as:</p>
                    <ul>
                      <li>Simple but stylish JCycle</li>
                      <li>Famous 3d slider</li>
                      <li>Carousel slider</li>
                    </ul>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus condimentum, massa eu</p>

                </div>
            </div>


            <div id="box2">
                    <h2>wide range of header sliders</h2>
    
                    
                    <div>
    
                        <p>We already have 3 absolutely different sliders, such as:</p>
                        <ul>
                          <li>Simple but stylish JCycle</li>
                          <li>Famous 3d slider</li>
                          <li>Carousel slider</li>
                        </ul>
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus condimentum, massa eu</p>
    
                    </div>
                </div>
        </div>

    </div>

</body>
</html>